<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>原生js的基本操作</title>
</head>
<body>

<div>
    <p id="p1">hello vue</p>
</div>


<button id="btn">点击改变段落内容</button>

<script>


    //  命令式编程
    //  获取按钮的节点对象   绑定单击事件
    let btn = document.getElementById("btn");

    btn.onclick= function () {
        // 如何获取 p标签的内容  dom
        let p = document.getElementById("p1");
        console.log(p)
        let info = p.innerText  //  获取节点内容
        console.log(info)
        // 获取节点内容  改变节点内容
        p.innerText = info.toUpperCase();
        // p.innerHTML = '<h1>hello world</h1>'
    }

</script>

</body>
</html>